
<style type="text/css">
.not_delete {
	display: none;
	width: 200px;
	height: 30px;
	padding: 10px;
	background: #fff;
	border: 1px solid #f0f0f0;
	text-align: center;
	font-weight: bold;
	font-size: 15px;
	color: #FF721D;
}
</style>
<div id="effect" class="not_delete">

</div>
<c:remove var="messages" scope="session" />
<script type="text/javascript" src="<c:url value='/scripts/ui/jquery.effects.core.js'/> "></script>
<script type="text/javascript" src="<c:url value='/scripts/ui/jquery.effects.drop.js'/>"></script>

<script type="text/javascript">
	function showCallbackResult(returnString) {
		$("#effect").css( {
			"position" : "absolute",
			"display" : "block",
			"top" : 200,
			"left" : 400
		});
		$("#effect").html('');
		$("#effect").html(returnString);
		var options = {};
		$("#effect").effect('drop', options, 10000, callback);
	}
	function callback(){
		setTimeout(function(){
			$("#effect:hidden").removeAttr('style').hide().fadeIn();
			$("#effect").css( {			
				"display" : "none"					
			});
		}, 100);
	}
 	
 				
$(document).ready(function(){

<c:if test="${not empty msgs}">
var str='';
	<c:forEach var="msg" items="${msgs}">           
            str+= '<c:out value="${msg}"/>' ;
        </c:forEach>
	setTimeout(function( ) {	showCallbackResult(str);}, 800);
	<c:remove var="msgs" scope="session"/>
</c:if>
});

</script>


